<!-- 检票员端 检票记录详情 -->
<template>
  <div class="container">
    <div class="head">
    </div>
    <m-header :closeFn="() => this.$router.push({ name: 'trec', })">检票详情</m-header>
    <div class="main">
      <div class="content-wrap">
        <div class="detl-wrap">
          <template v-if="detlData.shuttle_name">
            <div class="field-wrap" v-for="(item, i) in fieldList" :key="i">
              <div class="label">{{ item.label }}</div>
              <div class="val" v-if="item.type === 'text'">{{ detlData[item.key] }}</div>
              <div class="val" v-else-if="item.type === 'img'">
                <img :src="detlData[item.key]" alt="" class="img">
              </div>
            </div>
          </template>
        </div>
      </div>
    </div>
    
  </div>
</template>

<script>
import { List, PullRefresh, } from 'vant'
import { formatDate, } from '@/utils/utils'

export default {
  name: '',
  components: {
    [List.name]: List,
    [PullRefresh.name]: PullRefresh,
  },
  computed: {
    
  },
  data() {
    return {
      fieldList: [
        { key: 'shuttle_name', label: '班车名称', type: 'text', disabled: true, },
        { key: 'packag_type_name', label: '套票类型', type: 'text', disabled: true, },
        { key: 'ticket_typall_name', label: '票种', type: 'text', disabled: true, },
        { key: 'seat_no', label: '去程座位', type: 'text', disabled: true, },
        { key: 'seat_no_leave', label: '回程座位', type: 'text', disabled: true, },
        { key: 'passengers_name', label: '乘车人姓名', type: 'text', disabled: true, },
        { key: 'pictures_link', label: '照片', type: 'img', disabled: true, },
        { key: 'checkRes', label: '核验结果', type: 'text', disabled: true, optionList: [
          { id: 1, name: '通过', },
          { id: 0, name: '不通过', },
        ], show: false, },
        // { key: '', label: '拍照', type: 'upload', disabled: true, },
      ],
      detlData: {
        shuttle_name: '智城1号',
        packag_type_name: '往返套票',
        ticket_typall_name: '月票',
        seat_no: '4',
        seat_no_leave: '4',
        passengers_name: '王小明',
        pictures_link: 'http://yfgpwebapi.fszyrj.com/SchoolBus/UploadFiles/00443585-09f0-4377-9c5b-669154d800e3_MVIMG_20230607_094800.jpg',
        checkRes: '通过',
      },
    }
  },
  watch: {
    
  },
  created() {
    
  },
  methods: {
    
  },
}
</script>

<style scoped lang="less">
.container {
  width: 100%;
  box-sizing: border-box;
  overflow: auto;

  >.main {
    height: unset;
  }
}

.container {
  height: 100vh;

  >.main {
    padding: 15px;
    font-size: 14px;

    >.content-wrap {


      >.detl-wrap {
        padding: 15px;
        border-radius: 8px;
        font-size: 15px;
        background: #fff;

        >.field-wrap {
          display: flex;
          margin-bottom: 15px;

          >.label {
            min-width: 6.5em;
            color: #808080;
          }

          >.val {
            flex: 1;

            >.img {
              width: 100%;
            }

            &.val-select {
              display: flex;
              align-items: center;

              >.text {
                flex: 1;
              }
            }
          }
        }

        >.btn {
          width: 100%;
          height: 37px;
          border-radius: 4px;
        }
      }
    }
  }
}
</style>